<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      th:replace="demo/layout1">
    <div th:fragment="content">
        添加销售
        <form action="#" th:action="@{/sale/addSale}" th:object="${sale}"   method="post">
            名称：*
            <select data-placeholder="请选择商品"   name="productid"  required>
                <option   value=""   selected>-请选择商品-</option>
                <option   th:each="product:${productList}" th:value="${product.id}"  th:text="${product.productname}"></option>
            </select>
            <br/>
            名称（jquery）：*
            <select data-placeholder="请选择商品"   name="productid2" id="productid2" required>
            </select>
            <br/>
            售价：*
            <input type="text"  name="price"/>
            <br/>
            数量：*
            <input type="text"  name="quantity"/>
            <br/>
            <p>
                <input type="submit" value="保存" />
                <input type="reset" value="重置" />
            </p>
            layui时间：
            <input type="text" class="layui-input" id="test5" placeholder="yyyy-MM-dd HH:mm:ss"/>
            bootstrap 分页：
            <nav aria-label="Page navigation example">
                <ul class="pagination">
                    <li class="page-item"><a class="page-link" href="#">Previous</a></li>
                    <li class="page-item"><a class="page-link" href="#">1</a></li>
                    <li class="page-item"><a class="page-link" href="#">2</a></li>
                    <li class="page-item"><a class="page-link" href="#">3</a></li>
                    <li class="page-item"><a class="page-link" href="#">Next</a></li>
                </ul>
            </nav>

        </form>

        <script>
            $(function(){
                //调用后端接口
                $.get("/product/getProductList",
                    {},
                    function(data){
                        debugger;
                        let productlist = '<option   value=""   selected>-请选择商品-</option>';
                        for (let i = 0; i < data.length; i++) {
                            let product = data[i];
                            productlist += '<option   value="'+product.id+'"   selected>'+product.productname+'</option>';
                        }
                        //所有的书的列表
                        $("#productid2").html(productlist);
                    });
            });

            $(function(){
                // alert("jq main_xs ready");
                layui.use('laydate', function(){
                    var laydate = layui.laydate;
                    //日期时间选择器
                    laydate.render({
                        elem: '#test5'
                        ,type: 'datetime'
                    });
                });

            });

        </script>
    </div>
</html>